<template>
	<view class="all">
		<view>
			<image class="topp" :src="srcTop()"></image>
		</view>
		<view class="top">
			<image id="img" :src="srcUrl(leader.photoPath)"></image>
			<view class="right">
				<view class="name">姓名：{{leader.name}}</view>
				<view v-if="leader.job==null || leader.job==''">
					<view class="job">职务：未公开</view>
				</view>
				<view v-else>
					<view class="job">职务：{{leader.job}}</view>
				</view>
				<view class="time">任期：{{leader.jobStartDate}}至{{leader.jobEndDate}}</view>
			</view>
		</view>
		<view class="bot">
			<view class="jjie">简介:</view>
			<view v-if="leader.brief==null || leader.brief==''">
				<view class="tx">暂无简介信息</view>
			</view>
			<view v-else>
				<view class="tx">{{leader.brief}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data()	{
			return	{
				leader: {}				
			}
		},
		onLoad(e){
			uni.request({
					url:getApp().globalData.URL+"leader/findLeadersById?id="+e.id,
					method:'GET'
				})
			.then(data => {//data为一个数组，数组第一项为错误信息，第二项为返回数据
				var [error, res]  = data;
				console.log(res.data);
				let leader = res.data;				
				//任职起始日期转换(将时间戳转换成yyyy-MM-dd)
				leader.jobStartDate = this.happenTimeFun(leader.jobStartDate);
				//任职结束日期转换
				leader.jobEndDate = this.happenTimeFun(leader.jobEndDate);
				this.leader = leader
				
			})
		},
		methods:{
			happenTimeFun(num){//时间戳数据处理
					 let date = new Date(num);
					 //时间戳为10位需*1000，时间戳为13位的话不需乘1000
					 let y = date.getFullYear();
					 let MM = date.getMonth() + 1;
					 MM = MM < 10 ? ('0' + MM) : MM;//月补0
					 let d = date.getDate();
					 d = d < 10 ? ('0' + d) : d;//天补0
					 let h = date.getHours();
					 h = h < 10 ? ('0' + h) : h;//小时补0
					 let m = date.getMinutes();
					 m = m < 10 ? ('0' + m) : m;//分钟补0
					 let s = date.getSeconds();
					 s = s < 10 ? ('0' + s) : s;//秒补0
					 return y + '/' + MM + '/' + d; //年月日
				 },
			srcUrl:function(path){
				return getApp().globalData.Link+'file/图片/'+path;
			},
			srcTop:function(){
				return getApp().globalData.Link+'file/system/top.jpg';
			}
		}
	}
</script>

<style>
	.all {
		width: 100%;
		height: 100%;
	}

	.top {
		height: auto;
		width: 97%;
		margin-left: 7rpx;
		/* margin-top: 10rpx; */
		border: #999999 5rpx solid;
		display: flex;
		border-radius: 20rpx;
	}

	#img {
		margin: 20rpx 20rpx 20rpx 20rpx;
		width: 250rpx;
		height: 300rpx;
	}

	.right {
		margin-top: 20rpx;
		/* align-items: center; */

		height: 250rpx;
		width: 500rpx;
		line-height: 50rpx;
		margin-right: 20rpx;
		font-size: 30rpx;
		color: #808080;
	}

	.name {
		margin-top: 10rpx;
		border-top: #F0AD4E 2rpx solid;
		border-bottom: #F0AD4E 2rpx solid;
		align-items: center;
		line-height: 70rpx;
		font-size: 29rpx;
		/* border-radius: 10rpx; */
	}

	.job {
		margin-top: 10rpx;
		/* border-top: #D6D4D4 1rpx solid; */
		align-items: center;
		font-size: 29rpx;
	}

	.time {
		margin-top: 20rpx;
		border-top: #F0AD4E 2rpx solid;
		border-bottom: #F0AD4E 2rpx solid;
		line-height: 90rpx;
		align-items: center;
		font-size: 29rpx;
	}

	.jjie {
		border-bottom: 1px #F0AD4E dashed;
		margin-top: 30rpx;
		margin-left: 30rpx;
		width: auto;
		height: auto;
		font-size: 50rpx;
		/* display: block; */
		/* border-bottom: #999999 1rpx solid; */
		line-height: 90rpx;


	}

	.tx {
		width: auto;
		/* height: auto; */
		font-size: 30rpx;
		display: flex;
		/* text-decoration:underline; */
		text-indent: 2em;
		margin-left: 40rpx;
		line-height: 90rpx;
	}

	.bot {
		font-size: 50rpx;
		display: block;
		border-bottom: 1px #F0AD4E dashed;
		border-radius: 10rpx;
	}

	.one {
		/* margin-top: 40rpx; */

	}

	.bottom {
		display: flex;
	}

	.ee {
		margin-top: 170rpx;
		width: 250rpx;
		height: 100rpx;
		margin-left: 40rpx;
	}

	.ee1 {
		margin-top: 170rpx;
		width: 250rpx;
		height: 30rpx;
		margin-left: 170rpx;
	}

	.topp {
		width: 100%;
		height: 150rpx;
	}
</style>
